<template>
  <div class="{{ dashCase name }}">
    <a-spin :spinning="loading">
      {{ properCase name }}
    </a-spin>
  </div>
</template>
<script>
  {{#if wantStore}}
  import { mapState, mapActions, mapMutations } from 'vuex'
  import {
    SET_LOADING_MUTATION,
  } from './constants'
  {{/if}}
  export default {
    name: "{{ properCase name }}",
    data() {
      return {
        {{#if wantStore}}
        {{else}}
        loading:false,
        {{/if}}
      }
    },
    {{#if wantStore}}
    computed: mapState({
      loading: state => state.{{ properCase name }}.loading,
    }),
    {{/if}}
    methods: {
      {{#if wantStore}}
      ...mapMutations({
        setLoading:`{{ properCase name }}/${SET_LOADING_MUTATION}`,
      }),
      ...mapActions({})
      {{/if}}
    },
    mounted() {
      {{#if wantStore}}
      this.setLoading(true);
      setTimeout(()=>{
          this.setLoading(false);
      },1000)
      {{else}}
      this.loading=true;
      setTimeout(()=>{
        this.loading=false;
      },1000)
      {{/if}}
    }
  }
</script>
<style src="./style.less" lang="less" scoped></style>
